<template>
    <div class="subpage">
        <div class="banner"></div>
         <div class="title">
            <h2>错题本</h2>
            <el-divider><i class="el-icon-guide titleicon"></i></el-divider>
            <h3>以学员满意度、以学员学习效果为本</h3>
        </div>
        <div class="subjectinfo">
            <div class="userinfo">
                <ul class="userul">
                    <li><span>姓名：</span><span>张三丰</span></li>
                    <li><span>年级：</span><span>初中一年级</span></li>
                    <li><span>科目：</span><span>数学</span></li>
                    <li><p>想要成绩好，</p><p class="text2">动手又动脑！</p></li>
                </ul>
            </div>

            <div class="subinfo">
                <div class="back">返回上一页 >></div>
                <div class="subbox">
                    <ul class="clearfix">
                        <router-link to="/Wrongs/1">
                            <li class="typeitem">
                                <img src="/static/image/sub1.png" class="image"><p class="teacher">语文</p>
                            </li>
                        </router-link>
                        <router-link to="/Wrongs/2">
                            <li class="typeitem">
                                <img src="/static/image/sub2.png" class="image"><p class="teacher">数学</p>
                            </li>
                        </router-link>
                        <router-link to="/Wrongs/3">
                        <li class="typeitem">
                            <img src="/static/image/sub2.png" class="image"><p class="teacher">化学</p>
                        </li>
                        </router-link>
                        <router-link to="/Wrongs/4">
                        <li class="typeitem">
                            <img src="/static/image/sub3.png" class="image"><p class="teacher">英语</p>
                        </li>
                        </router-link>
                        <router-link to="/Wrongs/5">
                        <li class="typeitem">
                            <img src="/static/image/sub4.png" class="image"><p class="teacher">物理</p>
                        </li>
                        </router-link>
                        <router-link to="/Wrongs/6">
                        <li class="typeitem">
                            <img src="/static/image/sub4.png" class="image"><p class="teacher">生物</p>
                        </li>
                        </router-link>
                    </ul>
                </div>
            </div>
        </div>
        
    </div>
</template>

<script>
    export default{
        data(){
            return{

            }
        }
    }

</script>

<style lang='scss' scoped>
.subpage{
    .banner{
        width: 100%;
        height: 360px;
        background: url('/static/image/bannerpic.png') no-repeat;
        background-size:100% 100%;
        background-position: center; 
    }
    .title{
        h2 {
            font-size: 36px;
            text-align: center;
            margin: 40px 0;
            font-weight: normal;
        }
        h3 {
            font-size: 18px;
            text-align: center;
            color: #737373;
            margin: 40px 0;
            font-weight: normal;
        }
        .el-divider__text, .el-link {
            font-weight: 500;
            font-size: 45px;
        }
    }
    .subjectinfo{
        width: 1200px;
        margin: 0 auto;
        background-color: #ca0000;
        padding: 10px;
        min-height: 500px;
        display: flex;
        margin-top: 20px;
        margin-bottom: 20px;
        .userinfo{
            width: 200px;
            height: 100%;
            .userul{
                width: 100%;
                color: #fff;
                padding-left: 20px;
                padding-top: 20px;
                li{
                    height: 45px;
                    .text2{text-indent: 2em;line-height: 30px;}
                }
            }
        }
        .subinfo{
            flex: 1;
            height: 100%;
            background-color: #fff;
            padding: 10px;
            .back{
                width: 100%;
                text-align: right;
                color:#ca0000;
                cursor: pointer;
            }
            .subbox{
                width: 100%;
                display: flex;

            }
        }

    }
}

  .subbox ul {
      width: 100%;
      box-sizing: border-box;
      padding: 10px;
  }
  .subbox{
    width: 100%;
    box-sizing: border-box;
  }
  .subbox li {
    box-sizing: border-box;
    width: 30%;
    min-height: 240px;
    float: left;
    margin-left: 15px;
    margin-right: 15px;
    margin-bottom: 30px;
    border-left: 1px solid #eaeceb;
    border-right: 1px solid #eaeceb;
    box-shadow: 0 2px 3px #b2b2b2;
    text-align: center;
    img{
        height: 199px;
        width: 100%;
        display: block;
    }
    p{line-height: 50px;}
  }
</style>